<%@page contentType="text/html" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<c:set var="rootPath" scope="session" value="<%=request.getContextPath()%>"/>

<!DOCTYPE html>
<html>
    <head>
        <%@include file="common/head.jspf" %>
        <link rel="stylesheet" type="text/css" href="${rootPath}/css/login.css">
    </head>

    <body class="sb-l-c sb-r-c">

        <!-- 主体内容开始 -->
        <div id="main" class="animated fadeIn">

            <!-- Start: Content-Wrapper -->
            <section id="content_wrapper">

                <!-- Begin: Content -->
                <section id="content">

                    <div id="login_panel" class="center-block">
                        <div class="mw280 mauto p10">
                            <h1 class="text-center text-muted-lighter mb20"><i class="fa fa-html5 mr5"></i>后台管理系统</h1>
                            <c:if test="${model != null}">
                                <div class="alert alert-danger light alert-dismissable" style="display: block;">
                                    <i class="fa fa-remove pr10"></i>
                                    <strong>${model}</strong>
                                </div>
                            </c:if>
                            <form class="form-horizontal" role="form" method="post" action="login">
                                <div class="form-group">
                                    <input class="form-control" name="loginName" id="loginName" type="text" placeholder="登录名">
                                </div>
                                <div class="form-group">
                                    <input class="form-control" name="password" id="password" type="password" placeholder="登录密码">
                                </div>
                                <div class="form-group">
                                    <div class="col-xs-7 pn">
                                        <input class="form-control" name="captcha" id="captcha" type="text" placeholder="验证码">
                                    </div>
                                    <div class="col-xs-5 pl10 pt5"><img src="${rootPath}/captcha" alt="" id="loginCaptcha"/></div>
                                </div>
                                <div class="form-group">
                                    <button type="submit" class="btn btn-primary btn-block">登录</button>
                                </div>
                            </form>
                        </div>
                    </div>

                    <div class="mauto" style="width: 700px;">
                        <hr class="mt20 mb30">
                        <div class="text-muted" id="helpDoc">
                            <p class="text-center"><i class="fa fa-spin spinner"></i></p>
                        </div>
                    </div>
                </section>
                <!-- End: Content -->

            </section>
            <!-- End: Content-Wrapper -->

        </div>
        <!-- End: Main -->

        <!-- BEGIN: PAGE SCRIPTS -->

        <!-- 公共函数 -->
        <%@include file="common/scripts.jspf" %>

        <script type="text/javascript">
            // 刷新验证码
            $("#loginCaptcha").click(function () {
                var src = $(this).attr("src");
                $(this).attr("src", src);
            });

            // 判断当前浏览器是否Chrome
            if (!sys.browserSupport()) {
                sys.alert('为达到最佳使用效果，请使用Chrome 浏览器登录本系统<br /><div class="fs16 mt20"><a href="http://www.google.cn/chrome/browser/desktop/index.html" target="_blank">点击下载 Google Chrome 浏览器</a></div>');
            }

            /**
             * 载入使用说明
             */
            var adminDocTitle = "Admin使用说明", helpDoc = $("#helpDoc");
            $.get("cms/getItemByTitle/" + adminDocTitle, function (res) {
                if (res) {
                    helpDoc.html(res.content);
                } else {
                    helpDoc.html('');
                }
            });
        </script>

        <!-- 主体内容结束 -->
    </body>
</html>
